<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>定制任务</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="icon" href="../homepage/img/logo.png">
    <link rel="stylesheet" href="../public/layui-v2.5.5/css/layui.css" media="all">
    <link rel="stylesheet" href="../public/public.css" media="all">
    <style>
        body {
            background-color: #ffffff;
        }
        .layui-form-item .layui-form-label{
            font-size: 15px;
            width: 90px;
        }
        .layui-btn{
            background-color: #86a0f3;
        }
        .layui-form-checked span, .layui-form-checked:hover span {
            background-color: #86a0f3
        }
        .layui-form-radio>i:hover, .layui-form-radioed>i {
            color: #86a0f3
        }
        .layui-form-checked i, .layui-form-checked:hover i {
            color: #86a0f3
        }
        .layui-input-block {
            margin-left: 100px;
        }
    </style>
    <link rel="stylesheet" href="../css/head.css"/>
    <link rel="stylesheet" type="text/css" href="http://www.jq22.com/jquery/bootstrap-3.3.4.css">
    <link rel="stylesheet" href="../css/reset.css" />
</head>
<body>
<!-- 导航 -->
<header class="header">
    <div class="container clearfix">
        <div class="fl left">
            <a href="javascript:void(0)" ><img src="../homepage/img/logo.png" alt="" class="img1" /></a>
            <a href="javascript:void(0)"id="one">辅导员智慧工作平台</a>
        </div>
        <div class="fr nav">
            <ul class="navbar_nav" data-in="fadeInDown" data-out="fadeOutUp">
                <li class="active">
                    <a href="../homepage/homepage.html">首页</a>
                </li>
                <li class="dropdown">
                    <a href="javascript:void(0)">任务管理</a>
                    <div class="dropdown_menu">
                        <a href="#">定制任务</a>
                        <a href="../work-look/work-look.html">查看任务</a>
                    </div>
                </li>
                <li class="dropdown">
                    <a href="javascript:void(0)">培训管理</a>
                    <div class="dropdown_menu">
                        <a href="#">我的培训</a>
                        <a href="#">培训管理</a>
                    </div>
                </li>
                <li>
                    <a href="javascript:void(0)">文件库</a>
                </li>
                <li>
                    <a href="javascript:void(0)">网络公告</a>
                </li>
                <li>
                    <a href="javascript:void(0)">档案管理</a>
                </li>
            </ul>
        </div>
        <a href="javascript:void(0)" id="navToggle">
            <span></span>
        </a>
    </div>
</header>
<div class="layuimini-container"style="margin-top: 60px" >
<!--    http://localhost:8080/Counselor_System/manage/addTask-->
    <form class="layui-form" method="post" action="http://159.75.52.87/Counselor_System/manage/addTask" enctype="multipart/form-data">
        <div class="layui-form-item">
            <label class="layui-form-label">事务标题</label>
            <div class="layui-input-block">
                <input type="test" name="title" required lay-verify="required" placeholder="请输入事务标题" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">任务分类</label>
            <div class="layui-input-block">
                <input type="radio" name="task" value="临时" title="临时工作" checked="">
                <input type="radio" name="task" value="常规" title="常规工作">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">事务类型</label>
            <div class="layui-input-block">
                <input type="test" name="type" required lay-verify="required" placeholder="请输入事务类型：例如会议" autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item" >
            <label class="layui-form-label">接收人</label>
            <input type="hidden" name="people" value="">
<!--                    <button type="button" class="layui-btn" style="margin-left: 10px;">选择接收人</button>-->
<!--                    <div class="layui-col-md3  layui-input-block " style="margin-left: 10px">-->
<!--                            <input type="checkbox" name="receiver" value="all" title="全体"checked="">-->
<!--                            <input type="checkbox" name="18" title="18级" >-->
<!--                            <input type="checkbox" name="19" title="19级" >-->
<!--                            <input type="checkbox" name="20" title="20级" >-->
<!--                    </div>-->
            <div class="layui-col-md3">
                <button type="button" id="receive" class="layui-btn" style="margin-left: 10px;">选择接收人</button>
                <input type="text" value=""id="people1">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label "style="width: 90px;">截止时间</label>
            <div class="layui-input-inline" style="padding-left: 15px;">
                <input type="text" name="finish_time" required  id="date" lay-verify="datetime" placeholder="yyyy-MM-dd: HH:mm:ss" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">上传附件</label>
            <div class="layui-upload">
                <div style="padding-left: 100px;"><button type="button" class="layui-btn" id="testList">上传附件</button></div>
                <div class="layui-upload-list" style="padding-left: 100px">
                    <table class="layui-table">
                        <thead>
                        <tr><th>文件名</th>
                            <th>大小</th>
                            <th>状态</th>
                            <th>操作</th>
                        </tr></thead>
                        <tbody id="demoList"></tbody>
                    </table>
                </div>
                <div style="padding-left: 100px;"> <button type="button" class="layui-btn" id="testListAction">开始上传</button></div>
            </div>
        </div>
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">事务要求</label>
            <div class="layui-input-block" style="margin-left: 100px">
                <textarea name="request" class="layui-textarea" placeholder="请输入备注信息"></textarea>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn " lay-submit lay-filter="saveBtn">确认添加</button>
                <button type="reset" class="layui-btn layui-btn-primary" style="color: white;">重置</button>
            </div>
        </div>
    </form>
</div>
<script src="../public/layui-v2.5.5/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../public/wangEditor.min.js"></script>
<script>
    layui.use(['upload','form', 'layedit', 'laydate'], function () {
        var form = layui.form
            , layer = layui.layer
            , layedit = layui.layedit
            , laydate = layui.laydate
            , upload = layui.upload;
        $ = layui.$;
        //日期
        laydate.render({
            elem: '#date'
            ,type:'datetime'
        });

        //选择接收人
        $('#receive').on('click', function(){
            console.log("ok");
            layer.open({
                title: '选择接收人',
                type: 2,//层类型：2（iframe层）
                shade: 0.2,//遮罩
                maxmin:true,//最大最小化。
                shadeClose: true,//是否点击遮罩关闭
                area: ['600px', '400px'],
                shadeClose: true, //点击遮罩关闭
                content: 'receiver.html',
                btn:'关闭',
                end: function () {
                    let recivers = localStorage.getItem('recivers');
                    // console.log(recivers);
                    let teacher = localStorage.getItem('teacher');

                    console.log(recivers.split(',').map(item => parseInt(item)));
                    console.log(teacher.split(','));
                    $('input[name=people]').val(recivers.split(',').map(item => parseInt(item)));
                    $('#people1').val(teacher.split(','));
                }
            });
        });


        //执行上传文件
        var demoListView = $('#demoList')
            ,uploadListIns = upload.render({
            elem: '#testList'
            ,url: '#' //改成您自己的上传接口
            ,accept: 'file'
            ,multiple: true
            ,auto: false
            ,bindAction: '#testListAction'
            ,choose: function(obj){
                var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
                //读取本地文件
                obj.preview(function(index, file, result){
                    var tr = $(['<tr id="upload-'+ index +'">'
                        ,'<td>'+ file.name +'</td>'
                        ,'<td>'+ (file.size/1024).toFixed(1) +'kb</td>'
                        ,'<td>等待上传</td>'
                        ,'<td>'
                        ,'<button class="layui-btn layui-btn-xs demo-reload layui-hide">重传</button>'
                        ,'<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>'
                        ,'</td>'
                        ,'</tr>'].join(''));

                    //单个重传
                    tr.find('.demo-reload').on('click', function(){
                        obj.upload(index, file);
                    });

                    //删除
                    tr.find('.demo-delete').on('click', function(){
                        delete files[index]; //删除对应的文件
                        tr.remove();
                        uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
                    });

                    demoListView.append(tr);
                });
            }
            ,done: function(res, index, upload){
                if(res.files.file){ //上传成功
                    var tr = demoListView.find('tr#upload-'+ index)
                        ,tds = tr.children();
                    tds.eq(2).html('<span style="color: #5FB878;">上传成功</span>');
                    tds.eq(3).html(''); //清空操作
                    return delete this.files[index]; //删除文件队列已经上传成功的文件
                }
                this.error(index, upload);
            }
            ,error: function(index, upload){
                var tr = demoListView.find('tr#upload-'+ index)
                    ,tds = tr.children();
                tds.eq(2).html('<span style="color: #FF5722;">上传失败</span>');
                tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传
            }
        });

        localStorage.setItem('teacher','');
    });
    function add() {
        // $.ajax({
        //     url:'http://localhost:8080/Counselor_System/save/returnNum',
        //     dataType:'json',
        //     method:'get',
        //     success:function (res) {
        //         if (res.code==0){
        //             alert('添加成功');
        //             location.href='../work-look/work-look.html';
        //         }
        //         else{
        //             alert('添加失败');
        //             location.href='work-add.html';
        //         }
        //     }
        // })
    }
</script>
</body>
</html>